<template>
    <!-- 表格组件 -->  
    <table>
        <thead>
            <td>序号</td>
            <td>车辆部位</td>
            <td>车辆</td>
            <td>司机</td>
            <td>趟次</td>
            <td>下发状态</td>
            <td>执行状态</td>
            <td>原计划时间</td>
            <td>调整计划时间</td>
            <td>实际发车时间</td>
            <td>计划发车时间间隔（调整后）</td>
            <td>实际发车间隔</td>
            <td>到站不准点</td>
            <td>完成时间</td>
        </thead>
        <tbody>
            <tr v-for="(item, idx) in tableData" :key="item.id">
                <td>{{ idx + 1 }}</td>
                <td>{{ item.place }}</td>
                <td>{{ item.vehicleName }}</td>
                <td>{{ item.driverName }}</td>
                <td>{{ item.rounds }}</td>
                <td>{{ item.downStatus }}</td>
                <td>{{ item.executeStatus }}</td>
                <td>{{ item.planTime }}</td>
                <td>{{ item.adjustTime }}</td>
                <td>{{ item.executeTimeStart }}</td>
                <td>{{ item.planInterval }}</td>
                <td>{{ item.executeInterval }}</td>
                <td>{{ item.nonOnTime }}</td>
                <td>{{ item.executeTimeEnd }}</td>
            </tr>
        </tbody>
    </table>
</template>

<script setup >
const props = defineProps({
    tableData: Object
})

</script>

<style scoped lang="scss">
table {
    width: 100%;
    color: #fff;
    border-collapse: collapse;


    thead {
        background-color: #1C2F61;
    }

    tbody {}

    td {
        text-align: center;
        border: 1px solid #999;
    }
}
</style>